// 单组件文件基本结构

<template>
<!-- 组建的结构 -->
 <div class="demo">
  <h2>学校名称：{{schoolName}}</h2>
  <h2>学校地址：{{address}}</h2>
  <button type="button" @click="showName">点我提示学校姓名</button>
 </div>
</template>

<script>
// 组件的交互相关的代码，数据和方法等
export default {
    name: 'School',
    data() {
        return {
            schoolName:'尚硅谷',
            address:'北京昌平'
        }
    },
    methods: {
        showName(){
            alert(this.schoolName);
        }
    },
    
}
</script>

<style>
/* 组件的样式 */
 .demo{
     background-color: orange;
 }
</style>